<template>
  <div class="details-wrap">
    <div class="header-swipe">
      <van-swipe :autoplay="3000">
        <van-swipe-item v-for="(image, index) in swipeImage" :key="index">
          <img class="swipeimage" :src="image" />
        </van-swipe-item>
      </van-swipe>
    </div>
    <div class="plank">
      <van-row>
        <van-col class="item" span="8"><span >评价 </span><span class="colorred"> 8.39 </span><span class="colorred"> 中 </span></van-col>
        <van-col class="item" span="8">物流</van-col>
        <van-col class="item" span="8">售后</van-col>
      </van-row>
    </div>
    <van-cell-group>
      <van-cell title="联系客服">
        <van-icon slot="right-icon" name="phone-o" style="line-height: inherit;" />
      </van-cell>
      <van-cell title="证照信息">
        <van-icon slot="right-icon" name="credit-pay" style="line-height: inherit;" />
      </van-cell>
    </van-cell-group>
  
    <van-cell-group>
      <van-cell title="店铺简介" value="高品质的圣姑" />
      <van-cell title="开店时间" value="2019年02月27日" />
    </van-cell-group>
  </div>
</template>

<script>
export default {
  name: "Details",
  data() {
    return {
      swipeImage: [
        "https://img.yzcdn.cn/vant/apple-1.jpg",
        "https://img.yzcdn.cn/vant/apple-2.jpg",
        "https://img.yzcdn.cn/vant/apple-3.jpg",
        "https://img.yzcdn.cn/vant/apple-4.jpg",
        "https://img.yzcdn.cn/vant/apple-5.jpg"
      ]
    };
  }
};
</script>
<style lang="less" scoped>

.item  {
    text-align: center
  
}

.colorred {
  color:#ff6464
}
.colorgreen {
  color:#9cf196
}
</style>
